<template>
    <div>
        <h2>{{item}}</h2>
        <p>合计: {{sumNum}}</p>
        <el-button @click="nextTest">NEXT</el-button>
        <br>
        <br>
        <br>
        <div>
            <p>{{score}}</p>
            <el-button type="success" size="mini" @click="rightAndNextTest">正确</el-button>
            <el-button type="danger" size="mini" @click="score=0">重置</el-button>
        </div>
    </div>
</template>

<script>
    export default {

        props: [],

        components: {},

        data() {
            return {
                item: "",
                score: 0,
                sumNum: 1,
                testArr: [
                    "谈谈你对this的理解",
                    "call和apply和bind的区别",
                    "箭头函数与普通函数的区别",
                    "ajax是什么,如何创建一个ajax",
                    "let var const区别",
                    "JS中的数据类型都有那些,分别是什么",
                    "JS判断数据类型",
                    "JS基本数据类型和引用数据类型的区别",
                    "继承",
                    "object.create方法的作用",
                    "什么是promise",
                    "async和await",
                    "argmuments是什么?",
                    "vue中的$nextTick",
                    "图片懒加载实现原理",
                    "null和undefined区别",
                    "面向对象",
                    "mvvm和mvc",
                    "vue生命周期,vue生命周期,父子组件的生命周期",
                    "数组常用方法",
                    "深拷贝"
                ]
            };
        },

        mounted() {
            this.changeTestItem();
            this.$http.get("https://elm.cangdu.org/shopping/restaurants?latitude=39.90469&longitude=116.407173&offset=0&limit=20").then((data)=>{
                console.log("data");
            })

        },

        methods: {
            rightAndNextTest(){
                this.score += 20;
                this.nextTest();
            },
            changeTestItem(){
                let testIndex = Math.floor(Math.random()*this.testArr.length);
                this.item = this.testArr[testIndex];
            },
            nextTest(){
                this.sumNum ++;
                this.changeTestItem();
                if(this.sumNum === 6){
                    this.sumNum = 1;
                    this.score = 0;
                }
            }
        },

        computed: {}
    };
</script>

<style lang="less" type="text/less" scoped>

</style>
